class App_20201031224121 {
constructor( canvasId ) {
this.cc = document.getElementById( canvasId ).getContext( "2d" );
this.cc.canvas.style.width = "100%";
this.cc.canvas.style.minHeight = "16px";
this.cc.canvas.width = 512;
this.scale = 2;
this.horizon = 0.9;
this.cc.circle = function( x, y, r, fillStyle, strokeStyle ) {
this.beginPath();
this.arc( x, y, r, 0, 6.28, false );
this.closePath();
if( fillStyle ) {
this.fillStyle = fillStyle;
this.fill();
}
if( strokeStyle ) {
this.strokeStyle = strokeStyle;
this.stroke();
}
}.bind( this.cc );
this.cc.line = function( sx, sy, ex, ey, color ) {
this.beginPath();
this.moveTo( sx, sy );
this.lineTo( ex, ey );
if( color ) this.strokeStyle = color;
this.stroke();
}
this.clearRect = function() {
this.cc.clearRect(
-this.cc.canvas.width / this.scale / 2,
this.cc.canvas.height * this.horizon / this.scale,
this.cc.canvas.width / this.scale,
- this.cc.canvas.height / this.scale
);
}
let div = document.createElement( "div" );
this.cc.canvas.after( div );
let html = ( function() { /*
posing:
test
*/ } ).toString().match( /\/\*([\s\S]*)\*\// )[ 1 ];
let rangeId = Date.now();
this.rangeId = rangeId;
let textId = rangeId + 1;
html = html.replace( /range1/, rangeId );
html = html.replace( /sliderselected/, textId );
div.outerHTML = html;
document.getElementById( rangeId ).oninput = function( e ) {
//押下時
this.testpose( e.target.value );
let name = Object.keys( this.poses )[ e.target.value ];
document.getElementById( textId ).innerHTML = name;
}.bind( this );
this.svcs = new Array();
this.drawings = new Array();
let world = new SVC_Part_20201031224121( "world" );
world.addJoint( "世界>キャラ1", -100, 0 );
world.imgd.visibility = true;
world.imgd.type = "horizon";
world.debug1 = true;
let hara = new SVC_Part_20201031224121( "腹" );
hara.imgd.w = 18;
hara.imgd.h = 15;
hara.imgd.x = -12.5;
hara.imgd.y = -15;
hara.addJoint( "腹>胸", 0, 0 );
hara.addJoint( "腹>腰", 0, -12 );
let mune = new SVC_Part_20201031224121( "胸" );
mune.imgd.w = 20;
mune.imgd.h = 20;
mune.imgd.x = -12.5;
mune.imgd.y = -5;
mune.addJoint( "胸>首", 1, 14 );
mune.addJoint( "胸>左上腕", 1, 14 );
let jouwanL = new SVC_Part_20201031224121( "左上腕" );
jouwanL.imgd.w = 10;
jouwanL.imgd.h = 23;
jouwanL.imgd.x = -5;
jouwanL.imgd.y = -23;
jouwanL.addJoint( "左上腕>左前腕", 2, -20 );
let zenwanL = new SVC_Part_20201031224121( "左前腕" );
zenwanL.imgd.w = 10;
zenwanL.imgd.h = 23;
zenwanL.imgd.x = -7;
zenwanL.imgd.y = -21;
zenwanL.addJoint( "左前腕>左手", -2, -20 );
zenwanL.debug1 = true;
let teL = new SVC_Part_20201031224121( "左手" );
teL.imgd.w = 10;
teL.imgd.h = 10;
teL.imgd.x = -5;
teL.imgd.y = -10;
teL.addJoint( "つかみ", 0, -5 );
teL.debug1 = true;
let kubi = new SVC_Part_20201031224121( "首" );
kubi.imgd.w = 10;
kubi.imgd.h = 10;
kubi.imgd.x = -6;
kubi.imgd.y = -2;
kubi.addJoint( "首>頭", 0, 6 );
let atama = new SVC_Part_20201031224121( "頭" );
atama.imgd.w = 20;
atama.imgd.h = 20;
atama.imgd.x = -13;
atama.imgd.y = -1;
let kosi = new SVC_Part_20201031224121( "腰" );
kosi.imgd.w = 20;
kosi.imgd.h = 15;
kosi.imgd.x = -12.5;
kosi.imgd.y = -13;
kosi.addJoint( "腰>左もも", -2.5, -10 );
kosi.addJoint( "腰>右もも", -2.5, -10 );
let momoL = new SVC_Part_20201031224121( "左もも" );
momoL.imgd.w = 18;
momoL.imgd.h = 30;
momoL.imgd.x = -10;
momoL.imgd.y = -28;
momoL.addJoint( "左もも>左すね", -2.5, -27.5 );
let suneL = new SVC_Part_20201031224121( "左すね" );
suneL.imgd.w = 18;
suneL.imgd.h = 30;
suneL.imgd.x = -6.5;
suneL.imgd.y = -28;
suneL.addJoint( "左すね>左かかと", 2.5, -25 );
suneL.debug1 = true;
let kakatoL = new SVC_Part_20201031224121( "左かかと" );
kakatoL.imgd.w = 20;
kakatoL.imgd.h = 10;
kakatoL.imgd.x = -12;
kakatoL.imgd.y = -6;
kakatoL.addJoint( "左かかと>左つま先", -10, -2 );
kakatoL.addJoint( "接地", -10, -5 );
kakatoL.debug1 = true;
let tumasakiL = new SVC_Part_20201031224121( "左つま先" );
tumasakiL.imgd.w = 10;
tumasakiL.imgd.h = 7;
tumasakiL.imgd.x = -10;
tumasakiL.imgd.y = -4;
tumasakiL.addJoint( "接地", -10, 0 );
tumasakiL.debug1 = true;
//build.
world.connect( "世界>キャラ1", hara );
hara.connect( "腹>胸", mune );
mune.connect( "胸>首", kubi );
mune.connect( "胸>左上腕", jouwanL );
jouwanL.connect( "左上腕>左前腕", zenwanL );
zenwanL.connect( "左前腕>左手", teL );
kubi.connect( "首>頭", atama );
hara.connect( "腹>腰", kosi );
kosi.connect( "腰>左もも", momoL );
momoL.connect( "左もも>左すね", suneL );
suneL.connect( "左すね>左かかと", kakatoL );
kakatoL.connect( "左かかと>左つま先", tumasakiL );
let tick = 3.14 / 10;
this.poses = {
chokuritu : function() {
let to = world.jointHash[ "世界>キャラ1" ];
hara.adjust( tumasakiL, "接地", to.x, to.y, 0 );
this.reset();
},
kagami : function() {
let to = world.jointHash[ "世界>キャラ1" ];
hara.adjust( tumasakiL, "接地", to.x, to.y, 0 );
this.reset();
atama.rotation = tick * -.5;
kubi.rotation = tick * 0;
mune.rotation = tick * .5;
kosi.rotation = tick * -1;
momoL.rotation = tick * -1.5;
suneL.rotation = tick * 2.5;
kakatoL.rotation = tick * -1.5;
tumasakiL.rotation = tick * 0;
jouwanL.rotation = tick * -4;
zenwanL.rotation = tick * -2;
teL.rotation = tick * -1;
},
senobi : function() {
let to = world.jointHash[ "世界>キャラ1" ];
hara.adjust( tumasakiL, "接地", to.x, to.y, 0 );
this.reset();
atama.rotation = tick * -1.5;
kubi.rotation = tick * -1;
mune.rotation = tick * -0.5;
kosi.rotation = tick * 0.5;
momoL.rotation = tick * 0.5;
suneL.rotation = tick * 0;
kakatoL.rotation = tick * 2.5;
tumasakiL.rotation = tick * -3;
jouwanL.rotation = tick * -12;
zenwanL.rotation = tick * 0;
teL.rotation = tick * -1;
},
bridge : function() {
if( typeof this.flg === "undefined" ) {
this.kiseki.x = hara.abs.x;
this.kiseki.y = hara.abs.y;
this.flg = true;
}
let cursor = this.kiseki.indexG( 20 );
hara.adjust( hara, "腹>腰", cursor.x, cursor.y, -3.14 / 2 );
this.reset();
atama.rotation = tick * -1;
kubi.rotation = tick * -2;
mune.rotation = -3.14 /10;
kosi.rotation = 3.14 /10;
momoL.rotation = 3.14 /6;
suneL.rotation = 3.14 /4;
kakatoL.rotation = 3.14 /4;
tumasakiL.rotation = -3.14 /4;
jouwanL.rotation = tick * -13;
zenwanL.rotation = tick * 0;
teL.rotation = tick * 0;
},
sakadachi : function() {
let cursor = this.kiseki.indexG( 55 );
hara.adjust( teL, "つかみ", cursor.x, cursor.y, 0 );
this.reset();
this.reset();
// world.rotation = 0.5;
atama.rotation = tick * -1;
kubi.rotation = tick * -2;
mune.rotation = tick * -0.5;
kosi.rotation = tick * 0.5;
momoL.rotation = tick * 0;
suneL.rotation = tick * 0;
kakatoL.rotation = 3.14 /4;
tumasakiL.rotation = tick * 1;
jouwanL.rotation = tick * -8.85;
zenwanL.rotation = tick * 0;
teL.rotation = tick * -0.5;
},
a_10en_ochiteru : function() {
let cursor = this.kiseki.indexG( 55 );
hara.adjust( kakatoL, "接地", cursor.x + 15, cursor.y, -.125 );
this.reset();
atama.rotation = tick * -.5;
kubi.rotation = tick * 0;
mune.rotation = tick * 1;
kosi.rotation = tick * -1.5;
momoL.rotation = tick * -2.5;
suneL.rotation = tick * 0;
// suneL.rotation = tick * 2.5;
kakatoL.rotation = tick * 0;
// kakatoL.rotation = tick * -4;
tumasakiL.rotation = tick * 0;
jouwanL.rotation = tick * -5;
// zenwanL.rotation = tick * -2;
zenwanL.rotation = tick * 0;
teL.rotation = tick * -1;
},
waai : function() {
if( typeof this.flg2 === "undefined" ) {
this.kiseki2.x = hara.abs.x;
this.kiseki2.y = hara.abs.y;
this.flg2 = true;
}
let cursor = this.kiseki2.indexG( 7 );
hara.adjust( hara, "腹>腰", cursor.x, cursor.y, -.075 );
this.reset();
// atama.rotation = tick * -.5;
// kubi.rotation = tick * 0;
// mune.rotation = tick * 1;
// kosi.rotation = tick * -1.5;
// momoL.rotation = tick * -2.5;
// suneL.rotation = tick * 0;
kakatoL.rotation = tick * 4;
tumasakiL.rotation = tick * 1;
jouwanL.rotation = tick * -10;
zenwanL.rotation = tick * -.5;
teL.rotation = tick * -1;
},
kussin : function() {
let cursor = this.kiseki2.indexG( 9 );
hara.adjust( hara, "腹>腰", cursor.x, cursor.y, -3.14/2 );
this.reset();
atama.rotation = tick * .5;
kubi.rotation = tick * 0;
mune.rotation = tick * 2.5;
kosi.rotation = tick * -2.5;
momoL.rotation = tick * -5;
suneL.rotation = tick * 8;
kakatoL.rotation = tick * 4;
tumasakiL.rotation = tick * 1;
jouwanL.rotation = tick * -2.5;
zenwanL.rotation = tick * -2.5;
teL.rotation = tick * -2;
},
sinsin : function() {
let cursor = this.kiseki2.indexG( 20 );
hara.adjust( hara, "腹>腰", cursor.x, cursor.y, -3.14 );
this.reset();
atama.rotation = tick * -.5;
kubi.rotation = tick * -.5;
mune.rotation = tick * -.5;
kosi.rotation = tick * .5;
momoL.rotation = tick * .5;
suneL.rotation = tick * 0;
kakatoL.rotation = tick * 4;
tumasakiL.rotation = tick * 1;
jouwanL.rotation = tick * 1;
zenwanL.rotation = tick * 0;
teL.rotation = tick * 0;
},
kagami3 : function() {
let cursor = this.kiseki2.indexG( 30 );
hara.adjust( hara, "腹>腰", cursor.x, cursor.y, 2.5 );
this.reset();
atama.rotation = tick * -.5;
kubi.rotation = tick * 0;
mune.rotation = tick * 1;
kosi.rotation = tick * -1.5;
momoL.rotation = tick * -2.5;
suneL.rotation = tick * 0;
// suneL.rotation = tick * 2.5;
kakatoL.rotation = tick * 0;
// kakatoL.rotation = tick * -4;
tumasakiL.rotation = tick * 0;
jouwanL.rotation = tick * -5;
// zenwanL.rotation = tick * -2;
zenwanL.rotation = tick * 0;
teL.rotation = tick * -1;
},
kagami4 : function() {
let cursor = this.kiseki2.indexG( 47.75 );
hara.adjust( kakatoL, "接地", cursor.x + 0, cursor.y, 0 );
this.reset();
this.reset();
atama.rotation = tick * -.5;
kubi.rotation = tick * 0;
mune.rotation = tick * .5;
kosi.rotation = tick * -1;
momoL.rotation = tick * -1.5;
suneL.rotation = tick * 2.5;
kakatoL.rotation = tick * -1.5;
tumasakiL.rotation = tick * 0;
jouwanL.rotation = tick * -4;
zenwanL.rotation = tick * -2;
teL.rotation = tick * -1;
},
chokuritu2 : function() {
let cursor = this.kiseki2.indexG( 47.75 );
hara.adjust( kakatoL, "接地", cursor.x, cursor.y, 0 );
this.reset();
mune.rotation = tick * -.25;
kosi.rotation = tick * .25;
momoL.rotation = tick * .25;
kakatoL.rotation = tick * -.25;
jouwanL.rotation = tick * -10.5;
},
};
//debug. テスト用スライダの最大値をこのposesの最大値にする
let s = document.getElementById( this.rangeId );
s.setAttribute( "max", Object.keys( this.poses ).length - 1 );
this.svcs.push( world );
this.drawings.push( world );
this.kiseki = new Kiseki_20201031224121( {
f : function( x ) {
return -x * x;
},
x : -50,
y : 100,
zoomX : 1.6,
zoomY : 0.2,
zoom : 2,
sx : -10,
ex : 17.5,
step : 0.5,
cursor : 20,
} );
this.kiseki2 = new Kiseki_20201031224121( {
f : function( x ) {
return -2*x * x;
},
x : -50,
y : 100,
zoomX : 1.6,
zoomY : 0.2,
zoom : 2,
sx : -10,
ex : 17.5,
step : 0.5,
cursor : 20,
} );
this.drawings.push( this.kiseki );
this.drawings.push( this.kiseki2 );
this.testpose( s.value );
//リサイズ対応
let resizex;
addEventListener( "resize", resizex = function( e ) {
let screenH = window.innerHeight;
let H = document.getElementsByTagName( "H1" )[ 0 ];
if( H ) {
let canvas = this.cc.canvas;
canvas.style.height = H.offsetTop + "px";
let cr = canvas.getBoundingClientRect();
let minW = 512;
let minH = 448;
//minW, minH の矩形は、現在の領域に、
if( cr.width / minW > cr.height / minH ) {
console.log( "縦フィットする" );
let rate = cr.height / minH;
canvas.width = cr.width / rate;
canvas.height = minH;
} else {
console.log( "横フィットする" );
let rate = cr.width / minW;
canvas.width = minW;
canvas.height = cr.height / rate;
}
//中心位置
let transX = canvas.width / this.scale / 2;
let transY = -canvas.height / this.scale * this.horizon;
this.cc.scale( this.scale, -this.scale );
this.cc.translate( transX, transY );
this.draw( this.cc );
}
}.bind( this ) );
resizex();
}
start() {return;
if( 1 ) {
this.draw( this.cc );
}
if( 0 ) {
this.timerId = setInterval( function() {
this.draw( this.cc );
this.flg = ! this.flg;
}.bind( this ), 500 );
}
}
stop() {
clearInterval( this.timerId );
}
_draw( cc ) {
cc.beginPath();
cc.arc( 0, 0, 50, 0, 6.28, false );
cc.closePath();
cc.stroke();
}
draw( cc ) {
this.clearRect();
for( let i = 0; i < this.drawings.length; i++ ) {
let drawing = this.drawings[ i ];
drawing.draw( cc );
}
}
//各SVC_Part_20201031224121のreset()を実行(主にrotationを0にする等)
reset() {
for( let i = 0; i < this.svcs.length; i++ ) {
let svc = this.svcs[ i ];
svc.reset();
}
}
calc() {
for( let i = 0; i < this.svcs.length; i++ ) {
let svc = this.svcs[ i ];
svc.calc();
}
}
testpose( value ) {
let name = Object.keys( this.poses )[ value ];
this.poses[ name ].call( this );
this.calc();
console.log( name );
this.draw( this.cc );
}
}//App_20201031224121
class SVC_Part_20201031224121 {
constructor( title ) {
this.title = title;
this.jointHash = new Object();
this.rotation = 0;
this.adjustFrom = null;
this.adjustFromJointName = null;
this.adjust_toX = null;
this.adjust_toY = null;
this.adjust_r = null;
this.abs = new Object();
this.parent = null;
this.parentJoint = null;
this.children = new Array();
this.imgd = new TestRect_20201031224121( "rect" );
this.debug1 = false;
}
//Method No. 1 (SVC_Part_20201031224121)
addJoint( name, x, y ) {
let joint = new Object();
joint.name = name;
joint.x = x;
joint.y = y;
this.jointHash[ name ] = joint;
}
//---connect
//Method No. 2 (SVC_Part_20201031224121)
//他のSVC_Part_20201031224121を自身のJointへ接続
connect( jointName, part ) {
this.children.push( part );
part.parent = this;
//check.
if( ! this.jointHash[ jointName ] ) {
alert( "undefined key '" + jointName + "' in jointHash" );
}
part.parentJoint = this.jointHash[ jointName ];
}
//Method No. 3 (SVC_Part_20201031224121)
//たとえば、足を地面に接地する等
adjust( adjustFrom, adjustFromJointName, toX, toY, r ) {
//check. adjustFromJointName の存在チェック
if( typeof adjustFrom.jointHash[ adjustFromJointName ] === "undefined" ) {
console.log( adjustFrom.title + " does'nt have the name: " + adjustFromJointName + " at adjust()" );
}
this.adjustFrom = adjustFrom;
this.adjustFromJointName = adjustFromJointName;
this.adjust_toX = toX;
this.adjust_toY = toY;
this.adjust_r = r;
}
__adjustByThisStop( adjustFrom, adjustFromJointName, adjustTo ) {
//check. calc()が行われる前はabs.jointHashは未作成
if( ! adjustFrom.abs.jointHash ) {
alert( ( function() {/*
最初の描画でadjustByThisStop()を行おうとしましたが、
adjustByThisStop()は「前回の描画をもとにして
adjust()を行うメソッド」なので実行できません。
*/} ).toString().match( /\/\*\s*([\s\S]*)\s*\*\// )[ 1 ].replace( /\t/g, "" ) );
return;
}
let joint = adjustFrom.abs.jointHash[ adjustFromJointName ];
adjustTo.addJoint( "this stop", joint.x, joint.y );
this.adjust( adjustFrom, adjustFromJointName, adjustTo, "this stop" );
}
//Method No. 4 (SVC_Part_20201031224121)
reset() {
this.rotation = 0;
//子
for( let i = 0; i < this.children.length; i++ ) {
let child = this.children[ i ];
child.reset();
}
}
//Method No. 5 (SVC_Part_20201031224121)
calc() {
//自身の値の絶対座標を求める。
if( ! this.parent ) {
//親がない場合は
this.abs.x = 0;
this.abs.y = 0;
this.abs.rotation = this.rotation;
} else {
//親がある場合は
//check.
if( ! this.parentJoint ) {
alert( "undefined parentJoint at " + this.title );
}
let parentJointAbs = this.parent.abs.jointHash[ this.parentJoint.name ];
this.abs.x = parentJointAbs.x;
this.abs.y = parentJointAbs.y;
this.abs.rotation = this.parent.abs.rotation + this.rotation;
}
//各jointの絶対座標を求める。
this.abs.jointHash = new Object();
for( let name in this.jointHash ) {
let j = this.jointHash[ name ];
let res = this.mathRotate( j.x, j.y, this.abs.rotation );
this.abs.jointHash[ name ] = {
x : this.abs.x + res.X,
y : this.abs.y + res.Y,
}
}
//子もcalc()
for( let i = 0; i < this.children.length; i++ ) {
let child = this.children[ i ];
child.calc();
}
//たとえば、足を地面に接地する等
if( this.adjust_toX != null ) {
let from = this.adjustFrom.abs.jointHash[ this.adjustFromJointName ];
let adjustX = this.adjust_toX - from.x;
let adjustY = this.adjust_toY - from.y;
let adjustRotation = this.adjust_r - this.adjustFrom.abs.rotation;
let cx = this.adjust_toX;
let cy = this.adjust_toY;
this.calc2( adjustX, adjustY, adjustRotation, cx, cy );
}
}//calc()
//Method No. 6 (SVC_Part_20201031224121)
calc2( adjustX, adjustY, adjustRotation, cx, cy ) {
this.abs.x += adjustX;
this.abs.y += adjustY;
this.abs.rotation += adjustRotation;
//adjust回転
let res = this.mathRotateC( this.abs.x, this.abs.y, cx, cy, adjustRotation );
this.abs.x = res.X;
this.abs.y = res.Y;
//各jointについてadjust回転
for( let name in this.abs.jointHash ) {
let x = this.abs.jointHash[ name ].x + adjustX;
let y = this.abs.jointHash[ name ].y + adjustY;
let res = this.mathRotateC( x, y, cx, cy, adjustRotation );
this.abs.jointHash[ name ].x = res.X;
this.abs.jointHash[ name ].y = res.Y;
}
//子について
for( let i = 0; i < this.children.length; i++ ) {
let child = this.children[ i ];
child.calc2( adjustX, adjustY, adjustRotation, cx, cy );
}
}
//Method No. 7 (SVC_Part_20201031224121)
draw( cc ) {
//自身を描画
cc.save();
cc.translate( this.abs.x, this.abs.y );
cc.rotate( this.abs.rotation );
cc.translate( this.imgd.x, this.imgd.y );
this.imgd.draw( cc );
cc.restore();
//子を描画
for( let i = 0; i < this.children.length; i++ ) {
let child = this.children[ i ];
child.draw( cc );
}
//debug.
if( this.debug1 ) {
//各jointを○で示す
for( let name in this.jointHash ) {
let joint = this.abs.jointHash[ name ];
cc.save();
cc.translate( joint.x, joint.y );
cc.scale( 1, -1 );
cc.globalAlpha = .3;
cc.beginPath();
cc.arc( 0, 0, 3, 0, 6.28, false );
cc.closePath();
cc.strokeStyle = "red";
cc.stroke();
cc.font = "6px''";
cc.fillText( name, 0, 0 );
cc.restore();
}
}
}//draw()
//---
mathRotate( x, y, theta2 ) {
let theta1 = Math.atan2( y, x );
let hankei = Math.sqrt( x * x + y * y );
return {
X : Math.cos( theta1 + theta2 ) * hankei,
Y : Math.sin( theta1 + theta2 ) * hankei,
}
}
mathRotateC( x, y, cx, cy, theta2 ) {
x -= cx;
y -= cy;
let theta1 = Math.atan2( y, x );
let hankei = Math.sqrt( x * x + y * y );
return {
X : Math.cos( theta1 + theta2 ) * hankei + cx,
Y : Math.sin( theta1 + theta2 ) * hankei + cy,
}
}
}//SVC_Part_20201031224121
class TestRect_20201031224121 {
constructor( type ) {
this.x = 0;
this.y = 0;
this.w = 10;
this.h = 10;
this.visibility = true;
this.type = type;
}
draw( cc ) {
//check.
if( ! this.visibility ) return;
switch( this.type ) {
case "rect":
cc.strokeStyle = "black";
cc.strokeRect( 0, 0, this.w, this.h );
break;
case "horizon":
cc.fillStyle = "brown";
let w = 130;
let h = 23;
cc.fillRect( -w, -h, w * 2, h );
break;
default:
alert( "undefined type: '" + this.type + "'" );
}
}
}
class Kiseki_20201031224121 {
constructor( args ) {
this.f = function( x ) { return x; };
this.x = 0;
this.y = 0;
this.zoomX = 1;
this.zoomY = 1;
this.sx = -10;
this.ex = 10;
this.step = 1;
this.cursor = 0;
Object.assign( this, args );
this.adjustX = this.sx * this.zoomX * this.zoom;
this.adjustY = this.f( this.sx ) * this.zoomY * this.zoom;
this.cursorMax = Math.abs( this.ex - this.sx ) / this.step;
this.dir = this.ex >= this.sx ? 1 : -1;
}
cursorG() {
return this.indexG( this.cursor );
}
indexG( index ) {
let x = this.sx + index * this.step * this.dir; //グラフ上のx
return { //画面上のx,y
graphX : x,
x : this.x + x * this.zoomX * this.zoom - this.adjustX,
y : this.y + this.f( x ) * this.zoomY * this.zoom - this.adjustY,
};
}
draw( cc ) {
cc.circle( this.x, this.y, 4, null, "red" );
for( let i = 0; i <= this.cursorMax; i++ ) {
let g = this.indexG( i );
//check. 原点
if( g.graphX == 0 ) {
cc.line( g.x - 50, g.y, g.x + 50, g.y, "lightgray" );
cc.line( g.x, g.y - 50, g.x, g.y + 50, "lightgray" );
}
cc.circle( g.x, g.y, 1, i == this.cursor ? "red" : "lightblue" );
}
}
}